// Import your custom theme
@import '../../theme.scss';

.chart-list {
  flex: 1;
  display: flex;
  flex-flow: row wrap;

  &__empty {
    align-self: center;
    margin: auto;
    opacity: 0.7;
  }

  app-chart-item {
    padding-bottom: 1.5em;
    width: 100%;

    @include mappy-bp(medium large) {
      width: 50%;
      padding-right: 1.5em;
      &:nth-child(2n) {
        padding-right: 0;
      }
    }

    @include mappy-bp(large xlarge) {
      width: 33.3%;
      padding-right: 1.5em;
      &:nth-child(3n) {
        padding-right: 0;
      }
    }

    @include mappy-bp(xlarge) {
      width: 25%;
      padding-right: 1.5em;
      &:nth-child(4n) {
        padding-right: 0;
      }
    }

  }
}
